var myinputs = document.getElementsByTagName("input");
var show = document.getElementById("show");
var refurbish = document.getElementById("refurbish");
var mySpan = document.getElementsByTagName("span")

refurbish.onclick = function () {
    location.reload();
}

function addHint() {
    for(let i = 0;i<=11;i++ ){
        myinputs[i].onmouseover = hint;
    }
}
addHint();


async function buOnclick() {
    let a11 = 0;
    let b11 = 0;
    let c11 = 0;
    let d11 = 0;

    let a22 = 0;
    let b22 = 0;
    let c22 = 0;
    let d22 = 0;

    let a33 = 0;
    let b33 = 0;
    let c33 = 0;
    let d33 = 0;

    try {

        a11 = eval(myinputs[0].value);
        b11 = eval(myinputs[1].value);
        c11 = eval(myinputs[2].value);
        d11 = eval(myinputs[3].value);

        a22 = eval(myinputs[4].value);
        b22 = eval(myinputs[5].value);
        c22 = eval(myinputs[6].value);
        d22 = eval(myinputs[7].value);

        a33 = eval(myinputs[8].value);
        b33 = eval(myinputs[9].value);
        c33 = eval(myinputs[10].value);
        d33 = eval(myinputs[11].value);

    }catch(error){
        alert("输入格式不正确，请重新输入！");
        return;
    }

    var abc1 = 0;
    var abc2 = 0;
    var abc3 = 0;
    var Arrage1 = [
        [a11, b11, c11],
        [a22, b22, c22],
        [a33, b33, c33]
    ];
    var Detabc = threeDet(Arrage1);
    if (Detabc == 0) {
        alert("该线性方程组不存在唯一解！");
        return;
    }

    var Arrage2 = [
        [d11, b11, c11],
        [d22, b22, c22],
        [d33, b33, c33]
    ];
    var Arrage3 = [
        [a11, d11, c11],
        [a22, d22, c22],
        [a33, d33, c33]
    ];
    var Arrage4 = [
        [a11, b11, d11],
        [a22, b22, d22],
        [a33, b33, d33]
    ];
    var x = threeDet(Arrage2) / Detabc;
    var y = threeDet(Arrage3) / Detabc;
    var z = threeDet(Arrage4) / Detabc;
    context.lineWidth = 3;


    var bb = Math.max(Math.abs(-a11 * a22), Math.abs(-a11 + a33),
        Math.abs(-b11 + b22), Math.abs(-b11 + b33),
        Math.abs(-c11 + c22), Math.abs(-c11 + c33),
        Math.abs(-d11 + d22), Math.abs(-d11 + d33));

    checkAxes(mycanvas, context, bb, bb, 3);

    await drow3DVector(context, a11, a22, a33, false);
    await drow3DVector(context, b11, b22, b33, false);
    await drow3DVector(context, c11, c22, c33, false);
    drowCubeXYZ(context, a11, a22, a33, b11, b22, b33, c11, c22, c33, true, false);
    drow3Dparallelogram(context, b11, b22, b33, c11, c22, c33);
    await drow3DVector(context, x * a11, x * a22, x * a33, false);
    abc1 = x * a11 + y * b11;
    abc2 = x * a22 + y * b22;
    abc3 = x * a33 + y * b33;
    await drow3DVector2(context, x * a11, x * a22, x * a33, abc1, abc2, abc3);
    await drow3DVector(context, abc1, abc2, abc3, false);
    drowCubeXYZ(context, abc1, abc2, abc3, b11, b22, b33, c11, c22, c33, true, false);
    a11 = abc1;
    a22 = abc2;
    a33 = abc3;
    abc1 = abc1 + z * c11;
    abc2 = abc2 + z * c22;
    abc3 = abc3 + z * c33;
    await drow3DVector2(context, a11, a22, a33, abc1, abc2, abc3);
    await drow3DVector(context, abc1, abc2, abc3, false);
    drowCubeXYZ(context, abc1, abc2, abc3, b11, b22, b33, c11, c22, c33, true, false);

    mySpan[0].style.color = "green";
    mySpan[0].innerHTML = toFloat(x, 2);
    mySpan[1].style.color = "green";
    mySpan[1].innerHTML = toFloat(y, 2);
    mySpan[2].style.color = "green";
    mySpan[2].innerHTML = toFloat(z, 2);
}
drow3DAxes(context);
show.addEventListener("click", buOnclick);